import 'package:fish_redux/fish_redux.dart';
import 'package:flutter/material.dart';
import 'package:flutter_demo/login/login_verify/verify.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:pin_code_fields/pin_code_fields.dart';

import 'action.dart';
import 'state.dart';

Widget buildView(LoginVerifyState state, Dispatch dispatch, ViewService viewService) {
   bool isSelect = state.length == 4;
   String splitPhoneNumber(String src) {
    Pattern regex = RegExp(r'(1\w{2})(\w{4})(\w{4})');
    return src.replaceAllMapped(
        regex, (match) => '${match[1]} ${match[2]} ${match[3]}');
  }
  return GestureDetector(
      onTap: () {
        FocusScope.of(viewService.context)
            .requestFocus(FocusNode()); //点击空白处键盘消失
      },
      child: Scaffold(
        backgroundColor: Colors.white,
        appBar: AppBar(
          brightness: Brightness.light,
          backgroundColor: Colors.white, //导航栏和状态栏的的颜色
          elevation: 0, //阴影的高度
          leading: BackButton(
            color: Color.fromRGBO(160, 160, 160, 1),
            onPressed: () {
              Navigator.pop(viewService.context);
            },
          ),
        ),
        body: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Padding(
                padding: EdgeInsets.only(top: 36, left: 30),
                child: Text(
                  '请输入短信验证码',
                  style: TextStyle(
                      color: Color.fromRGBO(47, 47, 47, 1), fontSize: 30),
                )),
            Container(
              padding: EdgeInsets.symmetric(horizontal: 30),
              margin: EdgeInsets.only(top: 5),
              child: Text.rich(TextSpan(
                style: TextStyle(fontSize: 15),
                children: [
                  TextSpan(
                    text: '短信已发送至',
                    style: TextStyle(color: Color.fromRGBO(153, 153, 153, 1)),
                  ),
                  TextSpan(
                    text: '+86 ',
                    style: TextStyle(color: Color.fromRGBO(255, 16, 131, 1)),
                  ),
                  TextSpan(
                    text: splitPhoneNumber(state.phone),
                    style: TextStyle(color: Color.fromRGBO(255, 16, 131, 1)),
                  ),
                ]
              )),
            ),
            Container(
              padding: EdgeInsets.only(top: 27),
              margin: EdgeInsets.symmetric(horizontal: 30),
              alignment: Alignment.center,
              child: PinCodeTextField(
                appContext: viewService.context,
                keyboardType: TextInputType.number,
                length: 4,
                textStyle: TextStyle(
                  fontSize:33,
                  color: Color.fromRGBO(47, 47, 47, 1),
                ),
                pinTheme: PinTheme(
                    fieldWidth:65,
                    fieldHeight:60,
                    activeColor: Color.fromRGBO(255, 37, 38, 1),
                    selectedColor: Color.fromRGBO(255, 37, 38, 1),
                    inactiveColor: Color.fromRGBO(204, 204, 204, 1)
                ),
                onChanged: (value) {
                  print(value);
                  print(value.length);
                  dispatch(LoginVerifyActionCreator.upVerify(value.length));
                },
              ),
            ),
            Container(
              alignment: Alignment.center,
              child: LoginFormCode(onTapCallback: (){},),
            ),
            SizedBox(
              height: 30,
            ),
            Container(
              alignment: Alignment.center,
              child: GestureDetector(
                onTap: () {
                  // if(isSelect){
                     Navigator.pushNamed(viewService.context, 'bottom_tabbar');
                  // }else{
                  //     _toast("请输入验证码");
                  // }
                },
                child: Image.asset(
                  isSelect?'assets/images/auth_module/login_button.png':
                  'assets/images/auth_module/login_button_un.png',
                  width: 85,
                  height: 85,
                ),
              ),
            )
          ],
        ),
      ));
}
_toast( String msg){
  Fluttertoast.showToast(
    msg: msg,
    toastLength: Toast.LENGTH_SHORT,
    gravity: ToastGravity.CENTER,
    timeInSecForIos: 1,
    backgroundColor: Colors.black,
    textColor: Colors.white,
    fontSize: 16.0,
  );
}